<template>
  <div>
    <div v-if="isVue">
      <el-main>
        <slot name="content"></slot>
      </el-main>
    </div>
    <div v-else>
      <el-container>
        <el-header style="background-color:#fff">
          <div class="header-title2">
            <el-row>
              <el-col :span="3" :offset="0">
                <router-link to='/listMenu'><img style='height: 50px;' src="" /></router-link>
              </el-col>
              <el-col :span="4" :offset="17">
                <el-dropdown @command="logout">
                  <span class="el-dropdown-link2" style="color: black"></i>管理员<i class="el-icon-arrow-down el-icon--right"></i></span>
                  <el-dropdown-menu slot="dropdown">
                    <el-dropdown-item command="2">登出登录</el-dropdown-item>
                  </el-dropdown-menu>
                </el-dropdown>
              </el-col>
            </el-row>
          </div>
        </el-header>
        <el-container>
          <el-aside width="200px">
            <slideMenu :currentIndex="menuIndex">
            </slideMenu>
          </el-aside>
          <el-container>
            <el-main>
              <slot name="content"></slot>
            </el-main>
            <el-footer>
              <footer>
                <p class="am-padding-left">Copyright ©2018 由 <a href="http://www.zhen-yee.com" target="_blank">珠海蓁奕互联网科技有限公司</a> 开发</p>
              </footer>
            </el-footer>
          </el-container>
        </el-container>
      </el-container>
    </div>
  </div>
</template>
<script>
import utils from '../ttJs/utils.js'
import { validateData } from '../ttJs/utils.js'
import slideMenu from '@/components/Menu';

export default {
  name: '',
  data() {
    return {
      pageIndex: 1,
      isVue: true
    };
  },
  props: {
    menuIndex: String
  },
  components: {
    slideMenu
  },
  mounted: function() {
    var isVue = this.$route.query.isVue
    var isClear = this.$route.query.isClear
    if (utils.validateData(isVue)) {
      sessionStorage.setItem('isVue', 'isVue');
      this.isVue = true
    } else {
      if (utils.validateData(sessionStorage.getItem('isVue'))) {
        this.isVue = true
      } else {
        this.isVue = false
      }
    }
    if (utils.validateData(isClear)) {
      sessionStorage.setItem('isVue', '');
    }
  },
  methods: {
    logout() {
      var self = this;
      var url = '/ay/editor/logout';
      var params = {};
      var success = function(response) {
        self.$router.push({ name: 'Login' })
      }
      var fail = function() {}
      var complete = function() {}
      utils.requestLoading(url, params, success, fail, complete)
    }
  }
};

</script>
<style scoped rel="stylesheet/scss" lang="scss">
.page {
  position: relative;
  overflow: hidden;
  padding: 20px;
  .page-content {}
}

.el-header,
.el-footer {
  background-color: #E9EEF3;
  color: #333;
  line-height: 60px;
}

.el-aside {
  color: #333;
}

.el-dropdown-link {
  cursor: pointer;
  color: #409EFF;
}

.el-icon-arrow-down {
  font-size: 12px;
}

.header-title {
  display: inline-block;
  font-size: 20px;
  font-weight: bold;
}

.header-log {
  display: inline-block;
  float: right;
}

</style>
